﻿@using DevExpress.Blazor
@using Microsoft.AspNetCore.Components.Web;

<div>
    <DxTextBox Enabled="!Model.ReadOnly"
               Text="@Color"
               TextChanged="OnTextChanged"
               ClearButtonDisplayMode="DataEditorClearButtonDisplayMode.Auto">
        <Buttons>
            <DxButton Id="@Id" Click="()=>IsOpen=true">
                <div class="color-block" style="@BackgroundStyle" />
            </DxButton>
        </Buttons>
    </DxTextBox>
</div>

<DxFlyout @bind-IsOpen="IsOpen" PositionTarget="@("#"+Id)" Position="FlyoutPosition.BottomStart">
    <BodyTemplate>
        <ColorPalatteRenderer Color="@Color" ColorChanged="OnColorChanged" />
    </BodyTemplate>
</DxFlyout>

@code {
    public static RenderFragment Create(ColorPickerModel model)
    {
        return @<ColorPickerRenderer Model="model" />;
    }
}